<template>
  <div class="collage-order">
    <tabs :tabs="tabLists" class="tab" :handleClick="handleClick"></tabs>
    <router-view @editItem="editItem"></router-view>
  </div>
</template>

<script>
import Tabs from "@/components/tabs/tabs";

export default {
  data() {
    return {
      tabLists: [
        { label: "管理", name: "flash-sale-manage" },
        { label: "新增", name: "flash-sale-add" },
      ],
    };
  },
  methods: {
    handleClick(tab, event) {
      if (tab.index == 0 && this.tabLists[1].label == "编辑") {
        this.tabLists = [
          { label: "管理", name: "flash-sale-manage" },
          { label: "新增", name: "flash-sale-add" },
        ];
      }
      const path = this.tabLists[tab.index].name;
      this.$router.push({
        path: path,
      });
    },
    editItem(row) {
      this.tabLists = [
        { label: "管理", name: "flash-sale-manage" },
        { label: "编辑", name: "flash-sale-add" },
      ];
      this.$router.push({ name: "flash-sale-add", params: { row} });
    },
  },
  components: {
    Tabs,
  },
  name: "flash-sale",
};
</script>

<style scoped>
.collage-order {
  height: 100%;
}
</style>
